<script>
// 顶部tab+页面切换
import { defineComponent } from 'vue'
export default defineComponent({
  components: { },
	name: 'WeworkQr'
})
</script>
<script setup>
import { ref } from 'vue'

import { reqClientInfo } from '@/api'
import { toRaw } from '@vue/reactivity'
import Base from './components/base.vue'
import Staff from './components/staff.vue'
import Dynamics from './components/dynamics.vue'
import Journey from './components/journey.vue'
import Group from './components/group.vue'

const customerTable = ref(null)
const module = ref('Dynamics')
const editQr = ref(null)
const getCustomerData = (val) => {
	customerTable.value.getData(val)
}
const cancel = () => {
	isRefresh.value = false
	emits('diaUpdate')
}

const detail = ref(null)
const form = ref({})
const isRefresh = ref(false)
const id = ref(0)
const show = async (val) => {
	id.value = val
	console.log(val, '789870890')
	const r = await reqClientInfo({ id: val })
	if (r) {
		form.value = r.data
		isRefresh.value = true
	}
}
const getData=async()=>{
	console.log('asdasd')
	const r = await reqClientInfo({ id: id.value })
	if (r) {
		form.value = r.data
		isRefresh.value = false
		isRefresh.value = true
	}
}
const emits = defineEmits(['diaUpdate'])
defineExpose({
	show
})
</script>
<template>
	<div v-if="isRefresh">
		<div class="app-back-tab">
			<div class="app-flex-left">
				<span class="back-box app-pointer" @click="cancel">
					<MyIcon class="app-icon" name="Back" />
					<span class="back-box-mr">返回</span>
				</span>
			</div>
		</div>
		<div class="app-flex-2-start">
			<Base :form="form" @diaUpdate="getData" />
			<div class="c-d-b-w310-s">
				<div class="app-tab app-tab-margin-top" style="margin-right: 30px">
					<div @click="module = 'Dynamics'" :class="module == 'Dynamics' ? 'app-tab-item-active' : 'app-tab-item'">
						客户动态
					</div>
					<div @click="module = 'Staff'" :class="module == 'Staff' ? 'app-tab-item-active' : 'app-tab-item'">
						所属员工
					</div>
						<div @click="module = 'Group'" :class="module == 'Group' ? 'app-tab-item-active' : 'app-tab-item'">
						所在群聊
					</div>
					<!-- <div @click="module = 'Journey'" :class="module == 'Journey' ? 'app-tab-item-active' : 'app-tab-item'">
						客户旅程
					</div> -->
					
				</div>
				<div class="app-container-radius-margin" style="margin-right: 30px">
					<Staff :form="form" v-if="module == 'Staff'" @showEditQr="showEdit" />
					<Journey :form="form" v-if="module == 'Journey'" @showEditQr="showEdit" />
					<Group :form="form" v-if="module == 'Group'" @showEditQr="showEdit" />
					<Dynamics :form="form" v-if="module == 'Dynamics'" />
				</div>
			</div>
		</div>
	</div>
</template>
<style lang="scss">
.c-d-b-w310-s {
	width: calc(100% - 310px);
}
@import url('../../../../style/app-component.scss');
@import '../../../../style/mixin.scss';
</style>
